Skip to content

feat: align site to ICP brand guidelines v2#186

Merged
marc0olo merged 1 commit into
mainfrom
brand/align-to-icp-brand-v2
May 8, 2026
Merged

feat: align site to ICP brand guidelines v2#186
marc0olo merged 1 commit into
mainfrom
brand/align-to-icp-brand-v2

Conversation

@marc0olo
Copy link
Copy Markdown
Member

@marc0olo marc0olo commented May 8, 2026

Summary

  • Design tokens: corrects colors to brand values (parchment #faf9f5, rust #a8482b, ink #1a1a1a), adds JetBrains Mono, fixes container/prose max-widths, line-height 1.55. CTAs become pill-shaped with rust fill. Stat numbers use JetBrains Mono.
  • Dark mode: replaces prefers-color-scheme auto-switch with explicit data-theme toggle. Sun/moon button in the header, defaults to dark, persists in localStorage.
  • Copy: removes all em-dashes from rendered output. Heading italic moved to subject noun "agents". Removes body-copy italic stress. Page title separator changed from em-dash to colon.
  • OG image: removes non-brand circle decorations, updates to "ICP Skills" short form, regenerates og-image.png from SVG, flips og:image meta tag to PNG (social platforms don't support SVG).
  • Brand skills: adds .brand/icp-brand-voice/SKILL.md and .brand/icp-brand-design/SKILL.md as internal agent guidelines (not published). CLAUDE.md updated to require reading them before any website changes.

Applies the ICP brand design and voice guidelines to the website.

Design tokens: corrects colors to brand values (parchment #faf9f5, rust
#a8482b, ink #1a1a1a, hairline #e7e3da), adds JetBrains Mono to the font
stack, fixes container/prose max-widths (1280px / 720px), and sets line-
height to 1.55. CTAs become pill-shaped with rust fill. Stat numbers use
JetBrains Mono. Eyebrow and category labels use --fg-secondary.

Dark mode: switched from prefers-color-scheme auto-switch to explicit
data-theme="dark" / data-theme="light". Adds a sun/moon toggle to the
header with localStorage persistence; defaults to dark on first visit.
Adds [data-theme="light"] override block for when a toggle sets it.
CLAUDE.md records the docs-site exception to the brand's light-default
rule.

Copy: removes all em-dashes from rendered output (replaced with commas,
colons, or periods). Heading italic moved from adverb to subject noun
"agents". Removes body-copy italic stress in how-it-works. Page titles
switch separator from em-dash to colon.

OG image: removes non-brand circle decorations, updates to "ICP Skills"
short form, regenerates og-image.png from SVG (social platforms don't
support SVG for og:image), and flips the og:image meta tag to the PNG.

Brand skills: adds .brand/icp-brand-voice/SKILL.md and
.brand/icp-brand-design/SKILL.md as internal agent guidelines (not
published to the site). CLAUDE.md updated to require reading them before
any website changes.
@marc0olo marc0olo requested review from a team and JoshDFN as code owners May 8, 2026 16:09
@github-actions
Copy link
Copy Markdown

github-actions Bot commented May 8, 2026

Skill Validation Report

No skill files were changed in this PR — validation skipped.

@marc0olo marc0olo merged commit ebacef4 into main May 8, 2026
6 checks passed
@marc0olo marc0olo deleted the brand/align-to-icp-brand-v2 branch May 8, 2026 16:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants